<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<script>
			// 模板字符串

			// 1. 模板字符串中可以解析变量
			let name = `vae`;
			let sayHello = `hello, my name is ${name}`;
			console.log(sayHello);

			// 2. 模板字符串中可以换行
			let result = {
				name: 'vae',
				age: 35,
			};
			let html = `
                <div>
                    <span>${result.name}</span>
                    <span>${result.age}</span>    
                </div>
            `;
			console.log(html);

			// 3. 模板字符串中可以调用函数
			const sayHi = function () {
				return 'nanshou';
			};
			let greet = `${sayHi()} jiayou`;
			console.log(greet);
		</script>
	</body>
</html>
